@extends('layout.home2')
@section('title', '任务下达跟踪系统')
@section('content')
    <style>
        * {padding: 0;margin: 0;}
        th,td{text-align: center;height: 20px;}
        tr{border-bottom: 1px solid #D0D0D0;height: 50px;line-height: 50px;}
        .box{overflow: hidden}
        .box li{width: 25%;float: left;text-align: center;height: 30px;line-height: 30px;border-right: 1px solid orangered}
    </style>
    <div id="app">
        <select name="city" lay-verify="" v-model="picked" style="width: 100%;height: 30px;" @change="gettype(picked)">
            <option value="99">全部</option>
            <option value="1">已更新</option>
            <option value="2">未更新</option>
            <option value="3">关闭</option>
        </select>
        <table style="width:100%;height: auto;">
            <th style="font-weight: bold;width: 10%">序号</th>
            <th style="font-weight: bold;width: 40%">任务名称</th>
            <th style="font-weight: bold;width: 40%">任务发布时间</th>

                <tr v-for="(item,index) in items" :key="item.message" @click="jumpto(item.lsh)">
                    <td>@{{index+1}}</td>
                    <td>@{{item.rwmc }}</td>
                    <td>@{{item.rwfbsj }}</td>
                </tr>
        </table>
    </div>
    <script>
        let vm = new Vue({
            el:"#app",
            data(){
                return {
                    picked:'99',
                    items:[]
                }
            },

            mounted() {
                this.gettype(99);
            },
            methods:{
                jumpto(v){
                  window.location.href=`http://wx.newamstar.com:8078/newstar/public/view_rwxdgz_zjl_detail?lsh=${v}`
                },
                gettype(v){
                    $.ajax({
                        url:`http://wx.newamstar.com:8078/newstar/public/view_rwxdgz_zjl_json?type=${v}`,
                        dataType:"json"
                    }).then(function (res){
                        //console.log(res);
                        vm.items = res;
                    })
                }
            }
        })

    </script>
@endsection
